{extend name='admin@main'}

{block name="content"}
<form class="layui-form layui-card" onsubmit="return false;"  action="{:url('addOrEditGroupDo')}" data-auto="true" method="post" autocomplete="off">
    <div class="layui-card-body">
        <input type="hidden" name="activity_id" value="{$activity_id}">
        <button class="layui-btn" type='button' id="addGroup">添加组别</button>
        <div class="group">
            <div class="hand" style="margin-left: 2em; margin-bottom: 1em;margin-top: 1em">
                组别<span class="group_count">1</span> <span class="delete_icon">：</span>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">组别名称</label>
                <div class="layui-input-block label-required">
                    <input name="name[]" value='{$vo.name|default=""}' required placeholder="请输入组别名称" class="layui-input">
                    <!--{/if}-->
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">组别原价</label>
                <div class="layui-input-block label-required">
                    <input name="list_price[]" value='{$vo.list_price|default=""}' required placeholder="请输入价格" class="layui-input">
                    <!--{/if}-->
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">组别价格</label>
                <div class="layui-input-block label-required">
                    <input name="price[]" value='{$vo.price|default=""}' required placeholder="请输入价格" class="layui-input">
                    <!--{/if}-->
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">组别人数</label>
                <div class="layui-input-block label-required">
                    <input name="count[]" value='{$vo.count|default=""}' required placeholder="请输入组别人数(-1为不限制)" class="layui-input">
                    <!--{/if}-->
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <h3 class="color-green"><sup class='color-red font-s14 absolute' style="margin-left:-10px">*</sup>组别说明</h3>
            <textarea name="content">{$vo.content|default=''|raw}</textarea>
        </div>
    </div>
    <div class="hr-line-dashed"></div>
    <div class="layui-form-item text-center">
        {notempty name='vo.id'}<input type='hidden' value='{$vo.id}' name='id'>{/notempty}
        <button class="layui-btn" type='submit'>保存数据</button>
        <button class="layui-btn layui-btn-danger" type='button' data-confirm="确定要取消编辑吗？" data-close>取消编辑</button>
    </div>
</form>

{/block}
{block name='script'}
<script>
    window.form.render();
    require(['ckeditor', 'angular'], function () {
            window.createEditor('[name="content"]', {height: 500});
        }
    );
    $(function () {
        $("#addGroup").click(function () {
            let length = $(".group").length;
            let that = $(".group").eq(0);
            let html = that.clone();
            html.find('.group_count').html(length+1);
            let button = '<button type="button" class="layui-btn layui-btn-danger delete_group" style="margin-left: 1em">删除当前组别</button>';
            html.find('.group_count').html(length+1);
            html.find('.delete_icon').after(button);
            $(".group").last().after(html)
        });
    });
    //触发通过js动态添加的超链接a
    $(".layui-card-body").on("click", ".delete_group", function(){
        $(this).parent().parent().remove();
    });
</script>
{/block}